<template>
    <el-dialog @open="open" v-model="isOpen" :title="props.openType==='add'?'添加秒杀活动场次':'修改秒杀活动场次'" @close="close" style="width: 80%;min-width: 700px">
    <div>
    <el-button type="success" @click="addSmsSeckillSkuRelation">新增</el-button>
    <el-divider style="margin: 12px 0"/>
    <el-table ref="table" border v-loading="loading"  :data="data.tableData" header-cell-class-name="headerClass">
        <el-table-column align="center" type="index"  label="序号" width="80px" />
        <el-table-column align="center" prop="promotionSessionId" label="活动场次id" />
        <el-table-column align="center" prop="skuId" label="商品id" />
        <el-table-column align="center" prop="seckillPrice" label="秒杀价格" />
        <el-table-column align="center" prop="seckillCount" label="秒杀总量" />
        <el-table-column align="center" prop="seckillLimit" label="每人限购数量" />
        <el-table-column align="center" prop="seckillSort" label="排序" />
        <el-table-column align="center" prop="updateTime" label="更新时间" >
            <template #default="scope">
                {{moment(scope.row.updateTime).format("yyyy-MM-DD HH:mm:ss")}}
            </template>
        </el-table-column>
        <el-table-column align="center" label="操作">
            <template #default="scope">
                <el-popconfirm title="删除？" @confirm="deleteSmsSeckillSkuRelation(scope.row.id)"  @cancel="">
                    <template #reference>
                        <el-link type="danger" title="删除">
                            <el-icon :size="20">
                                <Delete />
                            </el-icon>
                            删除
                        </el-link>
                    </template>
                </el-popconfirm>
            </template>
        </el-table-column>
</el-table>
<el-pagination
        style="display: flex;align-items:center;justify-content:center;"
        v-model:currentPage="query.currentPage"
        v-model:page-size="query.pageSize"
        :page-sizes="[10, 20, 30]"
        layout="total, sizes, prev, pager, next, jumper"
        :total="query.total"
        @size-change="querySmsSeckillSkuRelation"
        @current-change="querySmsSeckillSkuRelation"
/>
<ModSmsSeckillSkuRelation @close="modSmsSeckillSkuRelation.isOpen = false"  @reload="querySmsSeckillSkuRelation"
              ref="modSmsSeckillSkuRelation"
              :openType="transData.openType"
              :id="transData.id" />
</div>
</el-dialog>
</template>

<script setup>
    import ModSmsSeckillSkuRelation from '@/views/mall/sms/components/ModSmsSeckillSkuRelation.vue'
    import request from '@/utils/request.js'
    import { ElMessage } from 'element-plus'
    import {ref, reactive, onMounted} from 'vue'
    import moment from 'moment'
    let transData = reactive({})
    let modSmsSeckillSkuRelation = ref(null)
    const  emits = defineEmits(['close'])
    let props = defineProps(['openType','id'])
    let isOpen = ref(false)
    defineExpose({isOpen})
    let data = reactive({
        modRole:false,
        tableData:[],
        openType:"",
        id:"",
    });
    let loading = ref(true)
    let query = reactive({dateRange:[],payload:{}, currentPage:1,pageSize:10,total:0})
    function open(){
        querySmsSeckillSkuRelation()
    }
    function querySmsSeckillSkuRelation(){
        debugger
        request.get(`/api/smsSeckillSession/getSmsSeckillSkuRelationBySessionId/${props.id}`).then(resp => {
            data.tableData = resp.records
            query.total = resp.total
            loading.value = false
        })
    }
    function close(){
        emits("close")
    }
    function reset(){
        query.payload.promotionId = ""
        query.payload.promotionSessionId = ""
        query.payload.skuId = ""
        query.payload.seckillPrice = ""
        query.payload.seckillCount = ""
        query.payload.seckillLimit = ""
        query.payload.seckillSort = ""
        query.dateRange=[]
    }

    function addSmsSeckillSkuRelation(){
        transData.id = props.id
        transData.openType = "add"
        modSmsSeckillSkuRelation.value.isOpen = true
    }

    function deleteSmsSeckillSkuRelation(id){
        request.get(`/api/smsSeckillSession/deleteSkuRelation/${id}`).then(resp => {
            querySmsSeckillSkuRelation()
            ElMessage({message: '删除成功！',openType: 'success'})
        });
    }

    function editSmsSeckillSkuRelation(id){
        transData.id = id
        transData.openType = "edit"
        modSmsSeckillSkuRelation.value.isOpen = true
    }

</script>
<style lang="css">

</style>


